<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- 导入vue -->
  <!-- <script src="./js/vue.js"></script> -->
  <title>Document</title>
  <!-- 导入自己写的Nue -->
  <script src="js/nue.js"></script>
</head>
<body>
  <div id="app">
    <input type="text" v-model="name">
    <p>{{name}}-{{age}}</p>
   <div v-html="h"></div>
   <div v-text="h"></div>
  </div>
</body>
<script>
/*
1.要想使用vue必须要创建vue实例,并且也是通过new,所以vue是一个类
2.创建好实例后,vue会根据属性el和data去找到对应区域和变量,来编译渲染页面
  2.1.el可以是id名也可以是dom元素   
  2.2.vue将el和data都保存在$el和$data

*/
//创建vue实例
  let vue = new Nue({
    el:'#app',//控制区域
    data:{//数据
      name:"yay",
      age:13,
      h:" <div>yay</div>"
    }
  })
  console.log('vue.$el: ', vue.$el);
  console.log('vue.$data: ', vue.$data);
</script>
</html>